<template>
    <div>
        <el-dialog
            title="操作选项"
            :visible.sync="sData"
            width="500px"
            :close-on-click-modal="false"
            v-dialogDrag
            v-loading="loading"
        >
            <el-form class="editDialog">
                <el-form-item label="化验日期:">
                    <el-input class="HYDay" v-model="time" :disabled="true"></el-input>
                </el-form-item>
                <el-form-item label="操作类型:">
                    <el-select v-model="CZForm.BJSelect" placeholder="请选择操作类型">
                        <el-option
                            v-for="item in BJOption"
                            :key="item.value"
                            :label="item.label"
                            :value="item.value"
                        ></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="报表类型:">
                    <el-select v-model="CZForm.BBSelect" placeholder="请选择报表类型">
                        <el-option
                            v-for="item in BBOption"
                            :key="item.value"
                            :label="item.label"
                            :value="item.value"
                        ></el-option>
                    </el-select>
                </el-form-item>
            </el-form>
            <div style="padding-bottom: 20px;">
                <el-button @click="ceditSub" type="primary" style="float:right;" size="medium">确定</el-button>
            </div>
        </el-dialog>
        <div v-show="false" class="wid100">
            <!-- 血红蛋白含量 -->
            <div ref="print_1" v-show="true" class="wid100 psfBox1">
                <div
                    v-for="(item,index) in PDFData.xhdbList"
                    :key="index"
                    v-if="PDFData.xhdbList != null"
                >
                    <div class="psfTitle">{{PDFData.formHeader}}</div>
                    <div class="psfDate">化验日期：{{PDFData.assayDate}}</div>
                    <table
                        border="1"
                        cellspacing="0"
                        cellpadding="0"
                        bordercolor="#000000"
                        class="myTable"   
                    >
                        <tr>
                            <th rowspan="2">小样编号</th>
                            <th rowspan="2">供血浆者卡号</th>
                            <th rowspan="2">供血浆者姓名</th>
                            <th rowspan="2">性别</th>
                            <th colspan="2">硫酸铜液中血滴状态</th>
                            <th>比重判定</th>
                        </tr>
                        <tr class="FW">
                            <td>液面下</td>
                            <td>液面上</td>
                            <td>结果 (g/L)</td>
                        </tr>
                        <tr v-for="(list,eq) in item" :key="eq">
                            <td>{{list.smallNo | Ssubstr}}</td>
                            <td>{{list.cardId}}</td>
                            <td>{{list.providerName}}</td>
                            <td>{{list.gender}}</td>
                            <td>
                                <span v-show="list.ym == 1">
                                    <img :src="PDFcheck" alt style="width: 15px;" />
                                </span>
                            </td>
                            <td>
                                <span v-show="list.ym == 0">
                                    <img :src="PDFcheck" alt style="width: 15px;" />
                                </span>
                            </td>
                            <td>{{list.decideResult}}</td>
                        </tr>
                    </table>
                    <div v-if="PDFData.xhdbList.length != index+1">
                         <div v-if="PDFData.xhdbList[PDFData.xhdbList.length-1].length >=19">
                            <div class="pageN">第{{index+1}} 页，共{{PDFData.xhdbList.length+1}} 页</div>
                            <div class="always"></div>
                        </div>
                        <div v-else-if="PDFData.xhdbList[PDFData.xhdbList.length-1].length <19">
                            <div class="pageN">第{{index+1}} 页，共{{PDFData.xhdbList.length}} 页</div>
                            <div class="always"></div>
                        </div>
                    </div>
                    <div v-else-if="PDFData.xhdbList.length == index+1">
                        <div v-if="PDFData.xhdbList[PDFData.xhdbList.length-1].length >= 19">
                            <div class="pageN">第{{index+1}} 页，共{{PDFData.xhdbList.length}} 页</div>
                            <div class="always"></div>
                        </div>
                    </div>
                    
                    <div class="customTable" v-if="PDFData.xhdbList.length == index+1">   
                            <div v-if="PDFData.xhdbList[PDFData.xhdbList.length-1].length >= 19">
                                <div class="psfTitle">{{PDFData.formHeader}}</div>
                                <div class="psfDate">化验日期：{{PDFData.assayDate}}</div>
                            </div>
                        <table
                            border="1"
                            cellspacing="0"
                            cellpadding="0"
                            bordercolor="#000000"
                            width="100%"
                        >
                            <tr>
                                <td rowspan="3">血红蛋白检测试剂</td>
                                <td>批号</td>
                                <td>{{xhdbReagent.batchNum}}</td>
                                <td>有效期至</td>
                                <td>{{xhdbReagent.overdueDate}}</td>
                            </tr>
                            <tr>
                                <td>环境温度要求</td>
                                <td>℃</td>
                                <td>检测环境温度</td>
                                <td>℃</td>
                            </tr>
                            <tr>
                                <td>生产厂家</td>
                                <td colspan="3">{{xhdbReagent.manufacturerName}}</td>
                            </tr>
                            <tr>
                                <td rowspan="2" colspan="2">硫酸铜比重测定(合格)</td>
                                <td colspan="3">{{PDFData.lstbzMale}}</td>
                            </tr>
                            <tr>
                                <td colspan="3">{{PDFData.lstbzFaMale}}</td>
                            </tr>
                        </table>
                        <div>
                            <el-row :gutter="20" class="el-row-tit">
                                <el-col :span="6">检测人数：{{PDFData.total}} 人</el-col>
                                <el-col :span="6">合格人数：{{PDFData.qualified}} 人</el-col>
                                <el-col :span="6">男性：{{PDFData.maleTotal}} 人</el-col>
                                <el-col :span="6">女性：{{PDFData.famaleTotal}} 人</el-col>
                                <el-col :span="12">检测者：{{PDFData.checkPName}}</el-col>
                                <el-col :span="12">核对者：{{PDFData.collatePName}}</el-col>
                            </el-row>
                        </div>
                    
                         <div v-if="PDFData.xhdbList[PDFData.xhdbList.length-1].length >=19">
                            <div class="pageN">第{{PDFData.xhdbList.length+1}} 页，共{{PDFData.xhdbList.length+1}} 页</div>
                            <div class="always"></div>
                        </div>
                        <div v-else-if="PDFData.xhdbList[PDFData.xhdbList.length-1].length <19">
                            <div class="pageN">第{{PDFData.xhdbList.length}} 页，共{{PDFData.xhdbList.length}} 页</div>
                            <div class="always"></div>
                        </div>
                
                    </div>
                </div>
                   
            </div>
            <!-- 血红蛋白检测 -->
            <div ref="print_2" v-show="true" class="wid100 psfBox1" v-if="PDFData.xhdbList != null">
                <div v-for="(item,index) in PDFData.xhdbList" :key="index">
                    <div class="psfTitle">{{PDFData.formHeader}}</div>
                    <div class="psfDate">化验日期：{{PDFData.assayDate}}</div>
                    <table
                        border="1"
                        cellspacing="0"
                        cellpadding="0"
                        bordercolor="#000000"
                        class="myTable"
                    >
                        <tr>
                            <th>小样编号</th>
                            <th>供血浆者卡号</th>
                            <th>姓名</th>
                            <th>性别</th>
                            <th>检测值</th>
                            <th>结果判定</th>
                        </tr>
                        <tr v-for="(list,eq) in item" :key="eq">
                            <td>{{list.smallNo | Ssubstr}}</td>
                            <td>{{list.cardId}}</td>
                            <td>{{list.providerName}}</td>
                            <td>{{list.gender}}</td>
                            <td>{{list.checkResult}}</td>
                            <td>{{list.decideResult}}</td>
                        </tr>
                    </table>
                    <div v-if="PDFData.xhdbList.length != index+1">
                        <div v-if="PDFData.xhdbList[PDFData.xhdbList.length-1].length >=29">
                            <div class="pageN">第{{index+1}} 页，共{{PDFData.xhdbList.length+1}} 页</div>
                            <div class="always"></div>
                        </div>
                        <div v-else-if="PDFData.xhdbList[PDFData.xhdbList.length-1].length <29">
                            <div class="pageN">第{{index+1}} 页，共{{PDFData.xhdbList.length}} 页</div>
                            <div class="always"></div>
                        </div>
                    </div>
                    <div v-else-if="PDFData.xhdbList.length == index+1">
                        <div v-if="PDFData.xhdbList[PDFData.xhdbList.length-1].length >= 29">
                            <div class="pageN">第{{index+1}} 页，共{{PDFData.xhdbList.length}} 页</div>
                            <div class="always"></div>
                        </div>
                    </div>

                    <div class="customTable" v-if="PDFData.xhdbList.length == index+1">
                        <div v-if="PDFData.xhdbList[PDFData.xhdbList.length-1].length >= 29">
                            <div class="psfTitle">{{PDFData.formHeader}}</div>
                            <div class="psfDate">化验日期：{{PDFData.assayDate}}</div>
                        </div>
                        <table
                            border="1"
                            cellspacing="0"
                            cellpadding="0"
                            bordercolor="#000000"
                            width="100%"
                        >
                            <tr>
                                <td>试剂厂家</td>
                                <td></td>
                                <td>批 号</td>
                                <td></td>
                            </tr>
                            <tr>
                                <td>化验者</td>
                                <td></td>
                                <td>有效期</td>
                                <td></td>
                            </tr>
                        </table>
                        <div v-if="PDFData.xhdbList[PDFData.xhdbList.length-1].length >=29">
                            <div class="pageN">第{{PDFData.xhdbList.length+1}} 页，共{{PDFData.xhdbList.length+1}} 页</div>
                            <div class="always"></div>
                        </div>
                        <div v-else-if="PDFData.xhdbList[PDFData.xhdbList.length-1].length <29">
                            <div class="pageN">第{{PDFData.xhdbList.length}} 页，共{{PDFData.xhdbList.length}} 页</div>
                            <div class="always"></div>
                        </div>
                    </div>
                </div>
               
            </div>
            <!-- 化验记录 -->
            <div
                ref="print_3"
                class="wid100 psfBox1"
                v-if="PDFData.assayResultList !=null"
                style="font-size:10px;"
            >
                <div v-for="(item,index) in PDFData.assayResultList" :key="index">
                    <div class="psfTitle">{{PDFData.formHeader}}</div>
                    <el-row :gutter="20" class="PDF_header">
                        <el-col :span="8">标本信息：全血和浆样标本</el-col>
                        <el-col :span="8">样本送检日期： {{PDFData.sendAssayDate}}</el-col>
                        <el-col :span="8">检测日期： {{PDFData.assayDate}}</el-col>
                    </el-row>
                    <table
                        border="1"
                        cellspacing="0"
                        cellpadding="0"
                        bordercolor="#000000"
                        class="myTable"
                        style="font-size:10px;"
                    >
                        <tr>
                            <th>供血浆者卡号</th>
                            <th>小样号</th>
                            <th>姓名</th>
                            <th>性别</th>
                            <th>类型</th>
                            <th>血型</th>
                            <th>HBsAg</th>
                            <th>抗-HCV</th>
                            <th>抗-HIV</th>
                            <th>梅毒</th>
                            <th>ALT</th>
                            <th>全血比重</th>
                            <th>蛋白含量g/L</th>
                            <th>检测结论</th>
                        </tr>
                        <tr v-for="(list,eq) in item" :key="eq">
                            <td>{{list.cardId}}</td>
                            <td>{{list.smallNo | Ssubstr}}</td>
                            <td>{{list.providerName}}</td>
                            <td>{{list.gender}}</td>
                            <td>{{list.plasmaType}}</td>
                            <td>{{list.bloodType}}</td>
                            <td>{{list.hbsag}}</td>
                            <td>{{list.hcv}}</td>
                            <td>{{list.hiv}}</td>
                            <td>{{list.syphilis}}</td>
                            <td>{{list.alt}}</td>
                            <td>{{list.qxbz}}</td>
                            <td>{{list.dbhl}}</td>
                            <td>{{list.checkResult}}</td>
                        </tr>
                    </table>
                    <div v-if="PDFData.assayResultList.length != index+1">
                        <div v-if="PDFData.assayResultList[PDFData.assayResultList.length-1].length >=26">
                            <div class="pageN">第{{index+1}}页，共{{PDFData.assayResultList.length+1}} 页</div>
                            <div class="always"></div>
                        </div>
                        <div v-else-if="PDFData.assayResultList[PDFData.assayResultList.length-1].length <26">
                            <div class="pageN">第{{index+1}}页，共{{PDFData.assayResultList.length+1}} 页</div>
                            <div class="always"></div>
                        </div>
                    </div>
                    <div v-else-if="PDFData.assayResultList.length == index+1">
                        <div v-if="PDFData.assayResultList[PDFData.assayResultList.length-1].length >= 26">
                            <div class="pageN">第{{index+1}} 页，共{{PDFData.assayResultList.length+1}} 页</div>
                            <div class="always"></div>
                        </div>
                    </div>
                    <div class="customTable customTable1" v-if="PDFData.assayResultList.length == index+1">
                        <div v-if="PDFData.assayResultList[PDFData.assayResultList.length-1].length >= 26">
                            <div class="psfTitle">{{PDFData.formHeader}}</div>
                            <el-row :gutter="20" class="PDF_header">
                                <el-col :span="8">标本信息：全血和浆样标本</el-col>
                                <el-col :span="8">样本送检日期： {{PDFData.sendAssayDate}}</el-col>
                                <el-col :span="8">检测日期： {{PDFData.assayDate}}</el-col>
                            </el-row>
                        </div>
                        <table
                            border="1"
                            cellspacing="0"
                            cellpadding="0"
                            bordercolor="#000000"
                            style="font-size: 10px;"
                            class="table_3"
                        >
                            <tr>
                                <td rowspan="3">试剂</td>
                                <td width="70px">厂名</td>
                                <td
                                    v-for="(list1,id) in PDFData.assayReagentList"
                                    :key="id"
                                >{{list1.manufacturerName}}</td>
                            </tr>
                            <tr>
                                <td>批号</td>
                                <td
                                    v-for="(list1,id) in PDFData.assayReagentList"
                                    :key="id"
                                >{{list1.batchNum}}</td>
                            </tr>
                            <tr>
                                <td>有效期</td>
                                <td
                                    v-for="(list1,id) in PDFData.assayReagentList"
                                    :key="id"
                                >{{list1.overdueDate}}</td>
                            </tr>
                            <tr>
                                <td rowspan="3">工作人员</td>
                                <td>检测者</td>
                                <td
                                    v-for="(list1,id) in PDFData.assayReagentList"
                                    :key="id"
                                >{{list1.checkPName}}</td>
                            </tr>
                            <tr>
                                <td>复核者</td>
                                <td
                                    v-for="(list1,id) in PDFData.assayReagentList"
                                    :key="id"
                                >{{list1.collatePName}}</td>
                            </tr>
                            <tr>
                                <td>报告者</td>
                                <td
                                    v-for="(list1,id) in PDFData.assayReagentList"
                                    :key="id"
                                >{{list1.reportPName}}</td>
                            </tr>
                            <tr>
                                <td colspan="2">检测方法</td>
                                <td
                                    v-for="(list1,id) in PDFData.assayReagentList"
                                    :key="id"
                                >{{list1.checkFun}}</td>
                            </tr>
                            <tr>
                                <td
                                    colspan="5"
                                >检测合格数: {{PDFData.total}} (份) ； 不合格和复检数: {{PDFData.notQualified}} (份)</td>
                                <td colspan="3">检测样本总数：</td>
                                <td colspan="3">{{PDFData.qualified}} (份)</td>
                            </tr>
                            <tr>
                                <td colspan="11">
                                    <el-row>
                                        <el-col :span="8">报告核对者：___________</el-col>
                                        <el-col :span="8">报告审核者：___________</el-col>
                                        <el-col :span="8">日期：</el-col>
                                    </el-row>
                                </td>
                            </tr>
                        </table>
                        <div v-if="PDFData.assayResultList[PDFData.assayResultList.length-1].length >=26">
                            <div class="pageN">第{{PDFData.assayResultList.length+1}} 页，共{{PDFData.assayResultList.length+1}} 页</div>
                            <div class="always"></div>
                        </div>
                        <div v-else-if="PDFData.assayResultList[PDFData.assayResultList.length-1].length <26">
                            <div class="pageN">第{{PDFData.assayResultList.length}} 页，共{{PDFData.assayResultList.length}} 页</div>
                            <div class="always"></div>
                        </div>
                    </div>

                </div>
               
            </div>
        </div>
    </div>
</template>
<script>
import api from "plugins/axios/api.js";
// 导入图片
import PDFcheck from "images/PDFcheck.png";
export default {
    props: { value: {}, dateA: {} },
    computed: {
        sData: {
            get() {
                return this.value;
            },
            set(val) {
                this.$emit("input", val);
            }
        }
    },
    data() {
        return {
            loading: false,
            time: "",
            BJOption: [
                { value: 1, label: "打印" },
                { value: 2, label: "导出Excel" }
            ],
            // 血红蛋白含量pdf
            PDFData: {
                xhdbList: [],assayResultList:[]
            },
            xhdbReagent: {
                batchNum: "",
                checkTemperature: null,
                manufacturerName: "",
                overdueDate: "",
                saveTemperature: null
            },

            BBOption: [
                { value: 1, label: "血红蛋白含量" },
                { value: 2, label: "血红蛋白检测" },
                { value: 3, label: "化检记录表" }
            ],
            CZForm: {
                BJSelect: 1,
                BBSelect: 1
            },
            PDFcheck //图片
        };
    },
    filters: {
        Ssubstr: function(val) {
            return parseInt(val.substr(8));
        }
    },
    watch: {
        dateA(newVal, oldVal) {
            this.time = this.timestampToTime(newVal, "yy-mm-dd");
        }
    },
    mounted() {
        this.time = this.timestampToTime(this.dateA, "yy-mm-dd");
    },
    methods: {
        ceditSub() {
            /**点击提交导出或打印 */
            let self = this;
            let _data = {
                HYDay: self.time,
                BJSelect: self.CZForm.BJSelect,
                BBSelect: self.CZForm.BBSelect
            };
            self.sData = false;

            if (_data.BJSelect == 1 && _data.BBSelect == 1) {
                //_data.HYDay
                self.printFac(
                    { date: _data.HYDay, printType: _data.BBSelect },
                    res => {
                        if(self.PDFData.xhdbList.length == 0 ) return self.$message.error('暂无数据！');      
                        self.PDFData.xhdbList = self.alterData(
                            self.PDFData.xhdbList,
                            31
                        );
                        setTimeout(() => {
                            self.$print(self.$refs.print_1);
                        }, 300);
                    }
                );
            }
            if (_data.BJSelect == 1 && _data.BBSelect == 2) {
                self.printFac(
                    { date:_data.HYDay, printType: _data.BBSelect },
                    res => {
                        if(self.PDFData.xhdbList.length == 0 ) return self.$message.error('暂无数据！'); 
                        self.PDFData.xhdbList = self.alterData(
                            self.PDFData.xhdbList,
                            32
                        );
                        setTimeout(() => {
                            self.$print(self.$refs.print_2);
                        }, 300);
                    }
                );
            }
            if (_data.BJSelect == 1 && _data.BBSelect == 3) {
                self.printFac(
                    { date: _data.HYDay, printType: _data.BBSelect },
                    res => {
                        if(self.PDFData.assayResultList == null ) return self.$message.error('暂无数据！'); 
                        self.PDFData.assayResultList = self.alterData(
                            self.PDFData.assayResultList,
                            38
                        );
                        setTimeout(() => {
                            self.$print(self.$refs.print_3);
                        }, 300);
                    }
                );
            }
        },
        printFac(data, callback) {
            //pdf 打印
            let self = this;
            self.sData = true;
            self.loading = true;
            api.selectPrintList(data)
                .then(res => {
                    if (res.statusCode == 200) {
                        self.PDFData = res.content;
                        callback(res);
                    }
                    self.loading = false;
                })
                .catch(reason => {
                    self.sData = false;
                    self.loading = false;
                });
        },
        alterData(arr, n) {
            //重构data数据（数组一维变二维）
            let self = this,
                Arr = arr != null ? arr : [],
                len = Arr.length,
                lineNum = (lineNum =
                    len % n === 0 ? len / n : Math.floor(len / n + 1)),
                res = [];
            for (let i = 0; i < lineNum; i++) {
                let temp = Arr.slice(i * n, i * n + n);
                res.push(temp);
            }
            return res;
        }
    }
};
</script>
<style lang="scss" scoped>
.HYDay {
    width: 215px;
}

.editDialog {
    padding-left: 90px;
}
.myTable {
    & {
        text-align: center;
        background-color: #fff;
        width: 100%;
    }
    & th,
    & td {
        padding: 5px 0;
    }
}
.FW {
    color: #333645;
    // font-weight: 600;
}
.pageN {
    text-align: center;
    padding-top: 10px;
}
.PDF_header {
    padding: 10px 0;
}
.el-row-tit .el-col {
    padding: 5px 0;
}
</style>
<style>
.wid100 {
    width: 100%;
    margin: auto;
    font-family: "\5B8B\4F53";
    font-size: 12px;
    font-weight: 100;
}
.psfBox1 th {
    font-weight: 300;
}
.psfBox1 .psfTitle {
    text-align: center;
    font-size: 20px;
    padding: 20px 0 10px 0;
    font-weight: 600;
    font-family: "微软雅黑";
}
.psfBox1 .psfDate {
    border-top: 1px #303133 solid;
    width: 100%;
    text-align: right;
    padding: 10px 0;
}
.psfBox1 {
    box-sizing: border-box;
    padding: 0 20px;
}
.psfBox1 .el-table {
    width: 100%;
    overflow-x: hidden;
}
.psfBox1 .el-table thead th {
    background-color: transparent !important;
}
.psfBox1 .el-table--scrollable-x .el-table__body-wrapper {
    overflow-x: hidden !important;
}
/* 自定义table */
.customTable table {
    background-color: #fff;
}
.customTable td {
    padding: 5px;
    text-align: center;
}
.customTable1 td {
    padding: 5px 0;
    text-align: center;
}
</style>
<style type="text/css" media="print">
@page {
    size: auto;
    margin: 0mm;
}
.always {
    page-break-after: always;
}
</style>

